{% extends "teacher/base.html" %}


{% block content_main %}
<div class="layui-row">
    <div class="layui-col-md12">
        <table id="demo" lay-filter="test"></table>
    </div>
</div>
{% endblock %}


{% block script %}
    <script type="text/html" id="barDemo">
      <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">从中选题</a>
{#      <a class="layui-btn layui-btn-xs" lay-event="more">更多 <i class="layui-icon layui-icon-down"></i></a>#}
    </script>
    <script>
    var test_paper_id = window.location.href.split("?")[1].split("=")[1]
    layui.use(function() {
        var table = layui.table; //表格
        var dropdown = layui.dropdown; //下拉菜单
        var layer = layui.layer;

        // 执行一个 table 实例
        table.render({
            elem: '#demo'
            , url: '/question_bank/query_banks_belong_to_this_teacher' //数据接口（此处为静态数据，仅作演示）
            , page: false //开启分页
            , toolbar: true  //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
            , cols: [[ //表头
                {#{type: 'checkbox', fixed: 'left'}#}
                {field: 'name', title: '题库名', width: 200}
                , {field: 'create_time', title: '创建时间', width: 200}
                , {fixed: 'right', title: '操作', width: 200, align:'center', toolbar: '#barDemo'}
            ]]
        });
        // 头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id)
            ,data = checkStatus.data; //获取选中的数据
            switch(obj.event){
              case 'add':
                layer.msg('添加');
              break;
              case 'update':
                if(data.length === 0){
                  layer.msg('请选择一行');
                } else if(data.length > 1){
                  layer.msg('只能同时编辑一个');
                } else {
                  layer.alert('编辑 [id]：'+ checkStatus.data[0].id);
                }
              break;
              case 'delete':
                if(data.length === 0){
                  layer.msg('请选择一行');
                } else {
                  layer.msg('删除');
                }
              break;
            };
        });

        // 单元格工具事件
        table.on('tool(test)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
            ,layEvent = obj.event; //获得 lay-event 对应的值
            if(layEvent === 'detail'){
              {#layer.msg('查看操作');#}
                window.location.href="/teacher/questions_list_url?id_question_bank="+data.id+"&test_paper_id="+test_paper_id;
            } else if(layEvent === 'more'){
              //下拉菜单
              dropdown.render({
                elem: this //触发事件的 DOM 对象
                ,show: true //外部事件触发即显示
                ,data: [{
                  title: '添加题目'
                  ,id: 'add'
                },{
                  title: '删除'
                  ,id: 'del'
                }]
                ,click: function(menudata){
                  if(menudata.id === 'del'){
                    layer.confirm('真的删除行么', function(index){
                      obj.del(); //删除对应行（tr）的DOM结构
                      layer.close(index);
                      //向服务端发送删除指令
                      $.post(
                          "/question_bank/delete_question_bank",
                          {
                              "id_question_bank": data.id
                          },
                          function (data,state) {
                          }
                      );
                    });
                  }else if(menudata.id === 'add'){
                      window.location.href="/admin/add_questions_url?id_question_bank="+data.id;
                  }
                }
                ,align: 'right' //右对齐弹出
                ,style: 'box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' //设置额外样式
              })
            }
        });
    });
    </script>
{% endblock %}
